<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <h6>下面是HelloWorld组件的展示</h6>
  <!-- 下面的 msg 是HelloWorld组件中定义的变量 -->
  <HelloWorld msg="Welcome to Your Vue.js App - 这个变量的定义在模板中" />
</template>

<script>

// 此文件是一个单文件的组件
// 单文件组件通常需要定义3部分内容：template模板部分、script脚本代码部分和style样式代码部分。

// 导入一个组件
import HelloWorld from './components/HelloWorld.vue'

// 将当前的组件进行导出
export default {
  name: 'App',
  components: {
    HelloWorld
  }
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
